<!doctype html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport"
        content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
  <meta http-equiv="X-UA-Compatible" content="ie=edge">
  <title>Document</title>
  <link rel="stylesheet" href="index.css">
  <script src="index.js"></script>
</head>
<body>
  <div class="container">
    <table border="">
      <thead>
      <tr>
        <th width="100">选择</th>
        <th width="100">姓名</th>
        <th width="100">成绩</th>
      </tr>
      </thead>
      <tbody>
      <tr>
        <td>
          <input type="checkbox">
        </td>
        <td>张三</td>
        <td>66</td>
      </tr>
      <tr>
        <td>
          <input type="checkbox">
        </td>
        <td>李四</td>
        <td>48</td>
      </tr>
      </tbody>
    </table>

    <form class="form">
      <label for="name">姓名:
        <input id="name" type="text">
      </label>
      <label for="grade">成绩:
        <input id="grade" type="text">
      </label>
      <input type="submit">
    </form>

    <div style="margin-top: 100px">
      <button class="all">全选</button>
      <button class="toggle">反选</button>
      <button class="cancel">取消</button>
    </div>
  </div>
</body>
</html>
